<template>
  <view class="router-view container">
    <!-- 总体评价 -->
    <view class="mb-20">
      <view class="title fz-15 bold mb-10">总体评价</view>

      <view>
        <radio-group class="box" @change="radioChange">
          <label
            class="box mr-10"
            v-for="(item, index) in items"
            :key="item.value"
          >
            <view class="middle">
              <radio :value="item.value" :checked="index === current" />
            </view>
            <view class="middle">{{ item.name }}</view>
          </label>
        </radio-group>
      </view>
    </view>

    <!-- 评价内容 -->
    <view class="mb-20">
      <view class="titl fz-15 bold mb-10">评价内容</view>

      <view>
        <textarea
          class="border border-deep bcl-white radius p-10 mt-10"
          placeholder="请输入评价内容~"
          :maxlength="maxLength"
          v-model="content"
        ></textarea>
      </view>

      <view class="box box-between fz-12 cl-second mt-10">
        <text></text>
        <text>{{ content.length }}/{{ maxLength }}</text>
      </view>
    </view>

    <!-- 评价质量 -->
    <view>
      <view class="title fz-15 bold mb-10">评价质量</view>

      <view class="box box-column-center mb-20">
        <view>工作速度：</view>
        <view>
          <uni-rate
            :value="speed_score"
            size="18"
            @change="rateChange1"
          ></uni-rate>
        </view>
      </view>

      <view class="box box-column-center">
        <view>工作质量：</view>
        <view>
          <uni-rate
            :value="quality_score"
            size="18"
            @change="rateChange2"
          ></uni-rate>
        </view>
      </view>

      <view class="box box-column-center mt-20" v-if="role == 'employer'">
        <view>工作态度：</view>
        <view>
          <uni-rate
            :value="attitude_score"
            size="18"
            @change="rateChange3"
          ></uni-rate>
        </view>
      </view>
    </view>

    <!-- 确认提交 -->
    <view
      class="uni-footer bcl-main-new cl-white text-center pointer pointer-filter"
      @tap="submit"
      >确认提交</view
    >
    
    <!-- 发布按钮 -->
    <div
      class="send-btn pointer"
      @click="toSendPage"
    >
      <image
        src="/static/images/release_1.png"
        style="width: 50px; height: 50px;"
      ></image>
    </div>
  </view>
</template>

<script>
import uniRate from "./components/uni-rate/uni-rate";
import { taskRate } from "@/apis/task";

export default {
  data() {
    return {
      content: "",
      maxLength: 100,

      items: [
        {
          value: "1",
          name: "好评",
          checked: true,
        },
        {
          value: "2",
          name: "中评",
        },
        {
          value: "3",
          name: "差评",
        },
      ],
      current: 0,

      taskId: "",
      role: "",
      workId: "",

      speed_score: 5,
      quality_score: 5,
      attitude_score: 5,
    };
  },

  onLoad(options) {
    let { taskId, role, workId } = options;
    this.taskId = taskId;
    this.role = role;
    this.workId = workId;
  },

  methods: {
    
    
    toSendPage() {
      
      let url = uni.getStorageSync("userInfo")
      if(url){
          uni.navigateTo({
            url:'/pages/index/release/submit?type=1'
          });

      }else{
        
          uni.navigateTo({
            url:'/user/login'
          });
      }
    },
    /**
     * 提交
     */
    async submit() {
      let params = {
        task_id: this.taskId,
        comment: this.content,
        work_id: this.workId,
        type: this.items[this.current].value,
        speed_score: this.speed_score,
        quality_score: this.quality_score,
        attitude_score: this.attitude_score,
      };

      if (!this.content.length) return this.$toast("请输入评价内容~");

      let { code, data } = await taskRate(params);

      if (code == 200) {
        this.$toast("评价成功", "success");

        setTimeout(() => {
          uni.navigateBack();
        }, 1000);
      }
    },

    radioChange: function(evt) {
      for (let i = 0; i < this.items.length; i++) {
        if (this.items[i].value === evt.target.value) {
          this.current = i;
          break;
        }
      }
    },

    rateChange1(event) {
      this.speed_score = event.value;
    },

    rateChange2(event) {
      this.quality_score = event.value;
    },

    rateChange3(event) {
      this.attitude_score = event.value;
    },
  },

  components: {
    uniRate,
  },
};
</script>

<style lang="scss" scoped>
.bcl-main-new {
  background-color: $color-main;
}
</style>
